<template>
	<div class="container">
	    <div class="pd bg-white">我的收藏</div>
	    <div class="list">
	    	    <div class="flex flex-row item bg-white pd mg-b" v-for="item,index in list">
        	<img class="flex-grow-0" src="http://scimg.jb51.net/allimg/151120/14-151120094951S5.jpg">
        	<div class="flex-grow-1 flex-col">
        		<div class="title">是有赞前端团队基于有赞统一的规范实现的于有赞统一于有赞统一于有赞统一Vue</div>
        		<div class="info subtit">是有赞前端团队基于有赞统一的规范实现的 于有赞统一于有赞统一于有赞统一Vue</div>
        		<div class="subtit">收藏人数：888</div>
        		<div class="flex-row">
        			<div class="flex-grow-1 moneyColor">￥55.00</div>
        			<div class="flex-grow-0"><span class="xiangsi">找相似</span></div>
        		</div>
        	</div>
        </div>
	    </div>
	</div>
</template>
<script>
	export default({
		data(){
			return{
				list:[1,2,3,4,6,7,8,9,0,,4,,4,5,56,6,6],
				imageURL:"http://scimg.jb51.net/allimg/151120/14-151120094951S5.jpg"
			}
		}
	})
</script>
<style scoped lang="less">
.list{
	position:fixed;
	top:2rem;
	bottom:0;
	left:0;
	width:100%;
	overflow-x: hidden;
    overflow-y: croll;
}
.item{
	.title{
	 color: #000000;
      overflow: hidden;
      display: -webkit-box;
      -webkit-line-clamp: 1;
      -webkit-box-orient: vertical;
      word-break: break-all;
      font-size:.6rem;
	}
	.info{
		 overflow: hidden;
      display: -webkit-box;
      -webkit-line-clamp: 1;
      -webkit-box-orient: vertical;
      word-break: break-all;
      font-size:.6rem;
	}
	img{
		height:3rem;
		width:3rem;
		margin-right:.5rem;
	}
	.xiangsi{
		display:inline-block;
		height:1rem;
		width:2.5rem;
		text-align:center;
		line-height:1rem;
		border:1px solid #666;
		border-radius:.5rem;
		color:#666;
	}

}

</style>